﻿@{
    ViewBag.Title = "Contact";
}
<hgroup>
    <h2>@ViewBag.Title.</h2>
</hgroup>
<div>
    <address>
        One Microsoft Way<br />
        Redmond, WA 98052-6399<br />
        <abbr title="Phone">P:</abbr>
        425.555.0100
    </address>

    <address>
        <i class="icon-envelope"></i><strong>Support:</strong>   <a href="mailto:Support@example.com">Support@example.com</a><br />
        <i class="icon-envelope"></i><strong>Marketing:</strong> <a href="mailto:Marketing@example.com">Marketing@example.com</a>
    </address>
</div>


<div class="container">
    <div class="row pad-top pad-bottom">


        <div class=" col-lg-6 col-md-6 col-sm-6">
            <div class="chat-box-div">
                <div class="chat-box-head">
                    GROUP CHAT HISTORY
                    <div class="btn-group pull-right">
                        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                            <span class="fa fa-cogs"></span>
                            <span class="sr-only">Toggle Dropdown</span>
                        </button>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="#"><span class="fa fa-map-marker"></span>&nbsp;Invisible</a></li>
                            <li><a href="#"><span class="fa fa-comments-o"></span>&nbsp;Online</a></li>
                            <li><a href="#"><span class="fa fa-lock"></span>&nbsp;Busy</a></li>
                            <li class="divider"></li>
                            <li><a href="#"><span class="fa fa-circle-o-notch"></span>&nbsp;Logout</a></li>
                        </ul>
                    </div>
                </div>
                <div class="panel-body chat-box-main">
                    <div class="chat-box-left">
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    </div>
                    <div class="chat-box-name-left">
                        <img src="assets/img/user.png" alt="bootstrap Chat box user image" class="img-circle" />
                        -  Justine Goliyad
                    </div>
                    <hr class="hr-clas" />
                    <div class="chat-box-right">
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    </div>
                    <div class="chat-box-name-right">
                        <img src="assets/img/user.gif" alt="bootstrap Chat box user image" class="img-circle" />
                        - Romin Royeelin
                    </div>
                    <hr class="hr-clas" />
                    <div class="chat-box-left">
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    </div>
                    <div class="chat-box-name-left">
                        <img src="assets/img/user.png" alt="bootstrap Chat box user image" class="img-circle" />
                        -  Justine Goliyad
                    </div>
                    <hr class="hr-clas" />
                    <div class="chat-box-right">
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    </div>
                    <div class="chat-box-name-right">
                        <img src="assets/img/user.gif" alt="bootstrap Chat box user image" class="img-circle" />
                        - Romin Royeelin
                    </div>
                    <hr class="hr-clas" />
                </div>
                <div class="chat-box-footer">
                    <div class="input-group">
                        <input type="text" class="form-control" placeholder="Enter Text Here...">
                        <span class="input-group-btn">
                            <button class="btn btn-info" type="button">SEND</button>
                        </span>
                    </div>
                </div>

            </div>

        </div>
        <div class="col-lg-3 col-md-3 col-sm-3">
            <div class="chat-box-online-div">
                <div class="chat-box-online-head">
                    ONLINE USERS (120)
                </div>
                <div class="panel-body chat-box-online">

                    <div class="chat-box-online-left">
                        <img src="assets/img/user.png" alt="bootstrap Chat box user image" class="img-circle" />
                        -  Justine Goliyad
                        <br />
                        ( <small>Active from 3 hours</small> )
                    </div>
                    <hr class="hr-clas-low" />

                    <div class="chat-box-online-right">
                        <img src="assets/img/user.gif" alt="bootstrap Chat box user image" class="img-circle" />
                        -  Romin Royeelin
                        <br />
                        ( <small>Active from 10 hours</small> )
                    </div>
                    <hr class="hr-clas-low" />
                    <div class="chat-box-online-left">
                        <img src="assets/img/user.png" alt="bootstrap Chat box user image" class="img-circle" />
                        -  Justine Goliyad
                        <br />
                        ( <small>Active from 3 hours</small> )
                    </div>
                    <hr class="hr-clas-low" />

                    <div class="chat-box-online-right">
                        <img src="assets/img/user.gif" alt="bootstrap Chat box user image" class="img-circle" />
                        -  Romin Royeelin
                        <br />
                        ( <small>Active from 10 hours</small> )
                    </div>
                    <hr class="hr-clas-low" />
                    <div class="chat-box-online-left">
                        <img src="assets/img/user.png" alt="bootstrap Chat box user image" class="img-circle" />
                        -  Justine Goliyad
                        <br />
                        ( <small>Active from 3 hours</small> )
                    </div>
                    <hr class="hr-clas-low" />

                    <div class="chat-box-online-right">
                        <img src="assets/img/user.gif" alt="bootstrap Chat box user image" class="img-circle" />
                        -  Romin Royeelin
                        <br />
                        ( <small>Active from 10 hours</small> )
                    </div>
                    <hr class="hr-clas-low" />
                    <div class="chat-box-online-left">
                        <img src="assets/img/user.png" alt="bootstrap Chat box user image" class="img-circle" />
                        -  Justine Goliyad
                        <br />
                        ( <small>Active from 3 hours</small> )
                    </div>
                    <hr class="hr-clas-low" />

                    <div class="chat-box-online-right">
                        <img src="assets/img/user.gif" alt="bootstrap Chat box user image" class="img-circle" />
                        -  Romin Royeelin
                        <br />
                        ( <small>Active from 10 hours</small> )
                    </div>
                    <hr class="hr-clas-low" />
                </div>

            </div>

        </div>
        <div class="col-lg-3 col-md-3 col-sm-3">
            <div class="chat-box-new-div">
                <div class="chat-box-new-head">
                    NEW CHATS (4)
                </div>
                <div class="panel-body chat-box-new">


                    <img src="assets/img/user.png" alt="bootstrap Chat box user image" class="img-circle" />
                    (@@Justine)

                    <hr class="hr-clas-low" />


                    <img src="assets/img/user.gif" alt="bootstrap Chat box user image" class="img-circle" />
                    (@@Romin)

                    <hr class="hr-clas-low" />
                    <img src="assets/img/user.png" alt="bootstrap Chat box user image" class="img-circle" />
                    (@@Justine)

                    <hr class="hr-clas-low" />


                    <img src="assets/img/user.gif" alt="bootstrap Chat box user image" class="img-circle" />
                    (@@Romin)

                    <hr class="hr-clas-low" />
                </div>

            </div>

        </div>
    </div>
</div>
